﻿/*
 *  公用信息提示模态窗体
 */

Hsp = {
    Common: {}, // 通用对象定义
    Formatter: {}, // 数据格式化处理
    Modal: {} // 模态窗体对象定义
};

if (!Hsp.Modal) Hsp.Modal = {};

/// <summary>
/// 模态窗体初始化
/// modalId-窗体编号
/// title-窗体标题
/// modalSize-窗体大小：modal-sm, 空值, modal-lg
/// callback-回调函数
/// </summary>

Hsp.Modal.Init = function(modalId, title, modalSize) {

    modalSize = modalSize || "";
    var $body = $("body");
    var $modal = $(`<div id="${modalId}" class="modal fade" tabindex="-1" role="dialog" data-bs-backdrop="static" data-bs-keyboard="false" aria-labelledby="${modalId}Label">
        </div>`);

    var $content = $(`
        <div class="modal-dialog ${modalSize}" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="${modalId}Label">${title}</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body"></div>
                <div class="modal-footer"></div>
            </div>
        </div>`);

    if ($body.length) {
        $content.appendTo($modal);
        $modal.appendTo($body);
    }
};


/// <summary>
/// 进度条消息模态窗体
/// modalId-窗体编号
/// </summary>

Hsp.Modal.ProgressBar = function(modalId) {

    var $content = $(`
                <div class="progress" style="margin-top: 15px;">
                    <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="min-width: 2em;">
                        <span>0%</span>
                    </div>
                </div>`);

    $content.appendTo($("#" + modalId + " .modal-body"));
};


/// <summary>
/// 圆形进度条模态窗体
/// modalId-窗体编号
/// title-窗体标题
/// </summary>

Hsp.Modal.CircleMessage = function(modalId, title) {

    var $body = $("body");
    var $modal = $(`<div id="${modalId}" class="modal fade" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" role="dialog"></div>`);

    //var $content = $(`
    //    <div class="modal-dialog modal-dialog-centered" role="document">
    //        <div class="modal-content">
    //            <div class="modal-body">
    //                <div class="row">
    //                    <div class="col-2" style="display: flex; justify-content: center;">
    //                        <div class="fa-3x text-aqua">
    //                            <i class="fa fa-spinner fa-pulse"></i>
    //                        </div>
    //                    </div>
    //                    <div class="col-10" style="display: flex; align-items: center; ">
    //                        <h4>${title}</h4>
    //                    </div>
    //                </div>
    //            </div>
    //        </div>
    //    </div>`);

    var $content = $(`
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-body">
                    <div class="row">
                        <div class="d-flex align-items-center">
                          <strong>${title}</strong>
                          <div class="spinner-border ms-auto" role="status" aria-hidden="true"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>`);

    if ($body.length) {
        $content.appendTo($modal);
        $modal.appendTo($body);
    }

    // 模态窗体关闭事件 
    $("#" + modalId).on("hidden.bs.modal", function() {
        $("#" + modalId).remove();
    });

    $("#" + modalId).on("shown.bs.modal", function(e) {
        // 关键代码，如没将modal设置为 block，则$modala_dialog.height() 为零  
        //$(this).css('display', 'block');
        //var modalHeight = $(window).height() / 2 - $("#" + modalId + " .modal-dialog").height() / 2;
        //$(this).find('.modal-dialog').css({
        //    'margin-top': modalHeight
        //});
    });
};
